	<div class="wrapper">

		<!-- TOP BAR -->		

        <!-- Nav -->

        <div class="nav2 navbar-inverse navbar-default navbar-static-top " id="navbar_id">
            <div class="navbar-collapse">
                <ul class="nav navbar-nav nav-left">
                    <li class="nav-launcher"></li>
                   <li>
                        <div class="dropdown">
                            <div class="dropdown-toggle" type="button" id="drop_selection" data-toggle="dropdown" aria-expanded="true"><a href="#"><i class="fa fa-bars"></i></a>
                            </div>
                            <ul class="dropdown-menu" role="menu" id="selections_list" aria-labelledby="drop_selection" >
                            </ul>
  						</div>
                    </li>

                    <li>
                         <div id="user_logoCV"><img src=cvjs_imagesLocation+"logo_cv_d.png"></div>
                    </li>
                    <li><div id="site_name" class="hint--bottom" data-hint="undefined">%Site%<div></li>
                    <li>
                        <div class="dropdown">
                            <div class="dropdown-toggle" type="button" id="drop_floor" data-toggle="dropdown" aria-expanded="true"><a href="#">%Floor% <span class="caret"></span></a>
                            </div>
                            <ul class="dropdown-menu" role="menu" id="floors_list" aria-labelledby="drop_floor" >
                            </ul>
                        </div>
                    </li>
                    <li>
                        <div class="dropdown">
                            <div class="dropdown-toggle" type="button" id="drop_locations_sensors" data-toggle="dropdown" aria-expanded="true"><a href="#">Locations <span class="caret"></span></a>
                            </div>
                            <ul class="dropdown-menu" role="menu" id="locations_sensors_list" aria-labelledby="drop_floor" >
                            </ul>
                        </div>
                    </li>
                    <li>
                        <div class="dropdown">
                            <div class="dropdown-toggle" type="button" id="drop_locations" data-toggle="dropdown" aria-expanded="true"><a href="#">%Location% <span class="caret"></span></a>
                            </div>
                            <ul class="dropdown-menu scrollable-menu" role="menu" id="locations" aria-labelledby="drop_locations" >
                            </ul>
                        </div>
                    </li>
                    <li>
                        <div class="dropdown" id="dropdown_custom_1">
                            <div class="dropdown-toggle" type="button" id="dropmenu_custom_1" data-toggle="dropdown" aria-expanded="true"><a href="#">%Custom 1% <span class="caret"></span></a>
                            </div>
                            <ul class="dropdown-menu scrollable-menu" role="menu" id="custom_1_list" aria-labelledby="dropmenu_custom_1" >
                            </ul>
                        </div>
                    </li>
                    <li>
                        <div class="dropdown" id="dropdown_custom_2">
                            <div class="dropdown-toggle" type="button" id="dropmenu_custom_2" data-toggle="dropdown" aria-expanded="true"><a href="#">%Custom 2% <span class="caret"></span></a>
                            </div>
                            <ul class="dropdown-menu scrollable-menu" role="menu" id="custom_2_list" aria-labelledby="dropmenu_custom_2" >
                            </ul>
                        </div>
                    </li>
                    <li>
                        <div class="dropdown" id="dropdown_custom_3">
                            <div class="dropdown-toggle" type="button" id="dropmenu_custom_3" data-toggle="dropdown" aria-expanded="true"><a href="#">%Custom 3% <span class="caret"></span></a>
                            </div>
                            <ul class="dropdown-menu scrollable-menu" role="menu" id="custom_3_list" aria-labelledby="dropmenu_custom_3" >
                            </ul>
                        </div>
                    </li>
                    <li>
                        <div class="dropdown" id="dropdown_custom_4">
                            <div class="dropdown-toggle" type="button" id="dropmenu_custom_4" data-toggle="dropdown" aria-expanded="true"><a href="#">%Custom 4% <span class="caret"></span></a>
                            </div>
                            <ul class="dropdown-menu scrollable-menu" role="menu" id="custom_4_list" aria-labelledby="dropmenu_custom_4" >
                            </ul>
                        </div>
                    </li>
                    <li>
                        <div class="dropdown" id="dropdown_custom_5">
                            <div class="dropdown-toggle" type="button" id="dropmenu_custom_5" data-toggle="dropdown" aria-expanded="true"><a href="#">%Custom 5% <span class="caret"></span></a>
                            </div>
                            <ul class="dropdown-menu scrollable-menu" role="menu" id="custom_5_list" aria-labelledby="dropmenu_custom_5" >
                            </ul>
                        </div>
                    </li>
                    <li>
                        <div class="dropdown" id="dropdown_custom_6">
                            <div class="dropdown-toggle" type="button" id="dropmenu_custom_6" data-toggle="dropdown" aria-expanded="true"><a href="#">%Custom 6% <span class="caret"></span></a>
                            </div>
                            <ul class="dropdown-menu scrollable-menu" role="menu" id="custom_5_list" aria-labelledby="dropmenu_custom_6" >
                            </ul>
                        </div>
                    </li>
                </ul>
 

               <ul class="pull-right nav-right">
                    <li>
                    	<div id="iconSearch">
						<img src=cvjs_imagesLocation+"menu_cv_search_right.png">
                    	</div>
                    </li>
				</ul>


            </div>
        </div>

        <!-- Modals -->

        <div id="infoModal" class="modal fade">
            <div class="modal-dialog modal-dialog-md">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                        <h4 class="modal-title">Information</h4>
                    </div>
                    <div class="modal-body">
                        <p><img id="logo" src=cvjs_imagesLocation+"logo_cv240x60.gif" border="1" width="240" height="60" /></p>
                        <p><strong><h3>CADViewer JS Floor Plan</h3></strong></p>
                        <p class="text-default"><small>v2.4.10</small></p>
                        <p class="text-default"><small>&copy; 2016 Tailor Made Software, Ltd. All Rights Reserved.</small></p>
                    </div>
                </div>
            </div>
        </div>

        <div id="clusterModal" class="modal fade">
            <div class="modal-dialog modal-dialog-sm">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                        <h4 class="modal-title">Cluster Details</h4>
                    </div>
                    <div class="modal-body">
                        <table>
                            <tbody>
                                <tr>
                                    <td><small>Organization:</small></td>
                                    <td>%Organization%</td>
                                </tr>
                                <tr>
                                    <td><small>Location:</small></td>
                                    <td>%Location%</td>
                                </tr>
                                <tr>
                                    <td><small>Cluster Name:</small></td>
                                    <td>%ClusterName%</td>
                                </tr>
                                <tr>
                                    <td><small>Time Zone:</small></td>
                                    <td>%TimeZone%</td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>

        <div id="searchModal" class="">
            <div class="modal-dialog modal-dialog-md">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" id="searchModalCloseButton" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                        <h4 class="modal-title">Search Locations</h4>
                    </div>
                    <div class="modal-body">
                        <form class="bs-example bs-example-form" role="form">
                            <div class="row">
                                <div class="col-md-12">
                                    <div class="input-group">
                                       <input id="searchfield_tag" type="text" class="form-control">
                                       <span class="input-group-btn">
                                          <button id="search_button" class="btn btn-default" type="button">
                                             <i class="glyphicon glyphicon-search"></i>
                                          </button>
                                       </span>
                                    </div><!-- /input-group -->

                                    <div class="row search-results-header">
                                        <div class="col-md-12 search-results-count">
                                        	<div id="SearchQuantity">0 item(s)</div>
                                        </div>
                                    </div>

									<div id="SearchResultsList" class="search-results-list fixedHeight-xl">
									</div>

                                 </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
        <div id="locInfoModal" class="modal fade">
            <div class="modal-dialog modal-dialog-sm">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                        <h4 class="modal-title">Location Details</h4>
                    </div>
                    <div class="modal-body">

                      <ul class="nav nav-tabs nav-tabs-custom-colored" id="tabContent">
                        <li id="loc_top_light" role="presentation" ><a href="#loc-lightControl-pane" data-toggle="tab">Light Controls</a></li>
                        <li id="loc_top_sensor" role="presentation"><a href="#loc-sensorData-pane" data-toggle="tab">Sensor Data</a></li>
                        <li id="loc_top_info" role="presentation"><a href="#loc-info-pane" data-toggle="tab">Information</a></li>
                      </ul>

                      <div class="tab-content">

                        <div class="tab-pane active lightingPane" id="loc-lightControl-pane">
                            <div class="row">
                                <div class="col-md-12">
                                    <p>
                                        <span id="location_locinfomodal1" class="location-title">%Location%</span>
                                         <span class="timestamp pull-right"><small id="refresh_light_tag">HH:MM ampm</small>&nbsp;<a><i id="refresh_light" class="fa fa-refresh"></i></a></span>
                                    </p>

                                    <!-- No Scene Available Light Control -->

                                    <div class="well" id="no_scenes_modal">
                                        <div id="lightLevel">
                                            <small>Light Level (0 - 100):</small>
                                            <span id="slider-value0" class="pull-right label label-default label-slider"></span>
                                        </div>
                                        <div class="slider" id="slider0_area">
                                            <div id="range-slider0"></div>
                                        </div>
                                    </div>

                                    <!-- Scene Available Light Control -->
                                    <div class="well" id="scenes_present_modal">
                                        <p><small>Active Scene:</small></p>
                                        <p>
                                            <form id="scene_form">
                                                <div id="sceneSelect-action">
                                                    <select name='mydropdown' id="sceneSelect_dropdown" class="form-control">
                                                    	<option value='LightsOn'>On</option>
                                                        <option value='LightsOff'>Off</option>
                                                        <option value='' disabled='disabled'>&mdash;</option>
                                                        <option value='Default'>Default lighting policy</option>
                                                        <option value='Presentation'>Presentation</option>
                                                        <option value='' disabled='disabled' selected>No scene selected</option>
                                                    </select>
                                                </div>
                                            </form>
                                        </p>
                                        <hr>
                                        <div id="lightLevel">
                                            <small>Light Level (0 - 100):</small>
                                            <span id="slider-value1" class="pull-right label label-default label-slider"></span>
                                        </div>
                                        <div class="slider" id="slider1_area">
                                            <div id="range-slider1"></div>
                                        </div>
                                    </div>

                                </div>
                            </div>
                        </div>

                        <div class="tab-pane" id="loc-sensorData-pane">
                            <div class="row">
                                <div class="col-md-12">
                                    <p>
                                        <span id="location_locinfomodal2" class="location-title">%Location%</span>
                                        <span class="timestamp pull-right"><small id="refresh_location_tag">HH:MM ampm</small>&nbsp;<a><i id="refresh_location" class="fa fa-refresh"></i></a></span>
                                    </p>
                                    <div class="well">
                                        <p><small>Occupancy</small></p>
                                        <p class="senDataDetail1" id="motions_ago">%Motion%</p>
                                        <p class="senDataDetail2"><small>since motion last detected</small></p>
                                        <p><small>Temperature</small></p>
                                        <p class="senDataDetail1" id="temp_now">%Temp%</p>
                                        <p class="senDataDetail2"><span id="ctemp_now">%TempCelsius%</span>
                                        </p>
                                        <p><small>Power Consumption</small></p>
                                        <p class="senDataDetail1" id="power_now">%Power%</p>
                                        <p class="senDataDetail2" id="cpower_now">%PowerMetric%</p>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="tab-pane" id="loc-info-pane">
                            <div class="row">
                                <div class="col-md-12">
                                    <p><span id="location_locinfomodal3" class="location-title">%Location%</span></p>
                                    <div class="well">
                                        <p><small>Type</small></p>
                                        <p class="senDataDetail1" id="location_type"></p>
                                        <p><small>Capacity</small></p>
                                        <p class="badge" id="location_occupancy"></p>
                                        <p><small>Tags</small></p>
                                        <p class="senDataDetail1" id="location_tags"></p>
<!--
                                        <p>General Information </p>

										<div id="BldgName"></div>

                                      	<p>Address </p>

										<div id="CompanyName"></div>
										<div id="Address"></div>
										<div id="CityName"></div>
										<div id="StateName"></div>
										<div id="ZipCode"></div>

                                      	<p>Contact </p>

										<div id="FacMgrName"></div>
										<div id="FacMgrTitle"></div>
										<div id="FacMgrEmail"></div>
										<div id="FacMgrPhone"></div>
-->
                                    </div>
                                </div>
                            </div>
                        </div>

                      </div> <!-- /tab-content -->
                    </div> <!-- /modal-body -->
                </div>
            </div>
        </div>

        <div id="siteInfoModal" class="modal fade">
            <div class="modal-dialog modal-dialog-sm">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                        <h4 class="modal-title">Site Details</h4>
                    </div>
                    <div class="modal-body">

                      <ul class="nav nav-tabs nav-tabs-custom-colored" id="tabContent">
                        <li class="active"><a href="#site-sensorData-pane" data-toggle="tab">Sensor Data</a></li>
                        <li><a href="#site-info-pane" data-toggle="tab">Information</a></li>
                      </ul>

                      <div class="tab-content">

                        <div class="tab-pane active" id="site-sensorData-pane">
                            <div class="row">
                                <div class="col-md-12">
                                    <p>
                                        <span id="site_BldgName" class="site-title">%Location%</span>
                                        <span class="timestamp pull-right"><small id="refresh_site_tag">HH:MM ampm</small>&nbsp;<a><i id="refresh_site" class="fa fa-refresh"></i></a></span>
                                    </p>
                                    <div class="well">
                                        <p><small>Occupancy</small></p>
                                        <p class="senDataDetail1" id="site_motions_ago">%Motion%</p>
                                        <p class="senDataDetail2"><small>since motion last detected</small></p>
                                        <p><small>Temperature</small></p>
                                        <p class="senDataDetail1" id="site_temp_now">%Temp%</p>
                                        <p class="senDataDetail2"><span id="site_ctemp_now">%TempCelsius%</span>
                                        </p>
                                        <p><small>Power Consumption</small></p>
                                        <p class="senDataDetail1" id="site_power_now">%Power%</p>
                                        <p class="senDataDetail2" id="site_cpower_now">%PowerMetric%</p>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="tab-pane" id="site-info-pane">
                            <div class="row">
                                <div class="col-md-12">
                                    <p><span id="site_BldgName2" class="site-title"></span></p>
                                    <div class="well">

                                        <p><small>Address</small></p>
                                        <div class="senDataDetail1" id="site_CompanyName"></div>
                                        <div id="site_Address"></div>
                                        <p class="senDataDetail2">
                                            <span id="site_CityName"></span>
                                            <span id="site_StateName"></span>
                                            <span id="site_ZipCode"></span>
                                        </p>

                                        <p><small>Contact</small></p>
                                        <div class="senDataDetail1" id="site_FacMgrName"></div>
                                        <div id="site_FacMgrTitle"></div>
                                        <div id="site_FacMgrEmail"></div>
                                        <div class="senDataDetail2" id="site_FacMgrPhone"></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                      </div> <!-- /tab-content -->
                    </div> <!-- /modal-body -->
                </div>
            </div>
        </div>

        <div id="mapDataModal" class="modal fade">
            <div class="modal-dialog modal-dialog-sm">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                        <h4 class="modal-title">Data Maps</h4>
                    </div>
                    <div class="modal-body">

                      <ul class="nav nav-tabs nav-tabs-custom-colored" id="tabContent">
                        <li role="presentation" class="active"><a href="#sensor-dataMap-pane" data-toggle="tab">Sensor Data</a></li>
                        <li role="presentation" id="outlineMarkersPane" ><a href="#loc-dataMap-pane" data-toggle="tab">Outlines/Markers</a></li>
                      </ul>

                      <div class="tab-content">

                        <div class="tab-pane active" id="sensor-dataMap-pane">

                            <div id="sensorMapPanel">
                                <div id="senDataModal">
<!--                                    <div class="col-md-12">-->
                                        <p>
                                            <small>
                                            Display Sensor Data By Type
                                            </small>
                                        </p>

                                        <div class="well">
                                            <table>
                                                <tbody>
                                                    <tr>
                                                        <td>
                                                            <input type="radio" value="none" id="none" name="mapDataRadioButton" checked>
                                                        </td>
                                                        <td>
                                                            <p>None</p>
                                                        </td>
                                                    </tr>
                                                    <tr>
                                                        <td>
                                                            <input type="radio" value="occupancy" id="occupancy" name="mapDataRadioButton">
                                                        </td>
                                                        <td><p>Occupancy</p>
                                                            <div class="occupancy-colors">

																<span class="hint--top low2 color-chip" data-hint="&gt; 10 min"></span>
																<span class="hint--top low1 color-chip" data-hint="7.5 to 10 min"></span>
																<span class="hint--top mid0 color-chip" data-hint="5 to 7.5 min"></span>
																<span class="hint--top high1 color-chip" data-hint="2.5 to 5 min"></span>
																<span class="hint--top high2 color-chip" data-hint="&lt; 2.5 min"></span>
                                                            </div>
                                                        </td>
                                                    </tr>
                                                    <tr>
                                                        <td>
                                                            <input type="radio" value="power" id="power" name="mapDataRadioButton">
                                                        </td>
                                                        <td><p>Power</p>
                                                            <div class="power-colors">

																<span class="hint--top low2 color-chip" data-hint="&lt; 0.1 W/sq ft | 1.08 W/sq m"></span>
																<span class="hint--top low1 color-chip" data-hint="0.1 to 0.2 W/sq ft | 1.1 to 2.2 W/sq m"></span>
																<span class="hint--top mid0 color-chip" data-hint="0.2 to 0.4 W/sq ft | 2.2 to 4.3 W/sq m"></span>
																<span class="hint--top high1 color-chip" data-hint="0.4 to 0.5 W/sq ft | 4.3 to 5.4 W/sq m"></span>
																<span class="hint--top high2 color-chip" data-hint="&gt; 0.5 W/sq ft | 5.4 W/sq m"></span>

                                                            </div>
                                                        </td>
                                                    </tr>
                                                    <tr>
                                                        <td>
                                                            <input type="radio" value="temperature" id="temperature" name="mapDataRadioButton">
                                                        </td>
                                                        <td><p>Temperature</p>
                                                            <div class="temperature-colors">

																<span class="hint--bottom low2 color-chip" data-hint="&lt; 70 &deg;F | 21 &deg;C"></span>
																<span class="hint--bottom low1 color-chip" data-hint="70 to 72 &deg;F | 21 to 22 &deg;C"></span>
																<span class="hint--bottom mid0 color-chip" data-hint="72 to 77 &deg;F | 22 to 25 &deg;C"></span>
																<span class="hint--bottom high1 color-chip" data-hint="77 to 81 &deg;F | 25 to 27 &deg;C"></span>
																<span class="hint--bottom high2 color-chip" data-hint="&gt; 81 &deg;F | 27 &deg;C"></span>

                                                            </div>
                                                        </td>
                                                    </tr>
                                                </tbody>
                                            </table>

                                            <div style="padding-top:10px" id="locSenToggle" class="hide">
                                                <small>Visualize Data By:(select one)</small>
                                                <div class="btn-group btn-group-sm" role="group" style="padding:8px 0">
                                                  <button id="locationMap" type="button" class="btn btn-primary">
                                                      <i class="fa fa-location-arrow"></i>
                                                      Locations
                                                      <small>
<!--
                                                          <span class="hint--top" data-hint="Choropleth Map">
                                                          <span class="glyphicon glyphicon-question-sign"></span>
                                                          </span>
-->
                                                      </small>
                                                  </button>
                                                  <button id="sensorMap" type="button" class="btn">
                                                      <i class="fa fa-wifi"></i>
                                                      Sensors
<!--
                                                      <small>
                                                          <span class="hint--top" data-hint="Bubble Map">
                                                          <span class="glyphicon glyphicon-question-sign"></span>
                                                          </span>
-->
                                                      </small>
                                                  </button>
                                                </div>
                                            </div>

                                        </div> <!-- /well -->
<!--                                    </div>-->
                                </div>
                            </div> <!--/ #sensorMap -->
                        </div>  <!--/ tab-pane -->

                        <div class="tab-pane" id="loc-dataMap-pane">
                            <div id="locationMapPanel">

                                <div class="row" id="locSensorModal">
                                    <div class="col-md-12">
        <!--
                                        <p><strong>Map Location Data</strong>
                                            <span class="pull-right"><a><i class="fa fa-refresh"></i></a></span>
                                        </p>
        -->

                                        <p>
                                            <small>
                                                Display Outlines/Markers
                                            </small>
                                        </p>
                                        <div class="well">
                                            <table class="location-colors">
                                                <thead>
                                                    <tr>
                                                        <td colspan="2">
                                                            <p>
                                                                <strong>Location Outlines</strong>
                                                            </p>
                                                        </td>
                                                    </tr>
                                                </thead>
                                                <tbody>
                                                    <tr>
                                                        <td>
                                                            <p>
                                                                <input id="toggleLoc" type="checkbox" name="locationTypeData" >
                                                            </p>
                                                        </td>
                                                        <td><p>Select All</p>
<!--                                                            <small>(%partialCount% of %fullCount% items)</small>-->
                                                        </td>
                                                    </tr>
                                                    <tr class="locBox">
                                                        <td class="meeting-rooms">
                                                          <input type="checkbox" name="locationTypeData" id="meeting_room">
                                                        </td>
                                                        <td>Meeting Rooms</td>
                                                    </tr>
                                                    <tr class="locBox">
                                                        <td class="offices">
                                                          <input type="checkbox" name="locationtypeData" id="offices">
                                                        </td>
                                                        <td>Offices</td>
                                                    </tr>
                                                    <tr class="locBox">
                                                        <td class="collab-space">
                                                          <input type="checkbox" name="locationtypeData" id="collab_space">
                                                        </td>
                                                        <td>Collaboration Spaces</td>
                                                    </tr>
                                                </tbody>
                                            </table>

                                        </div>
                                    </div>
                                </div>
                            </div> <!--/ #locationMap -->

                        </div>  <!--/ tab-pane -->
                      </div>  <!--/ tab-content -->
                    </div> <!--/ modal-body -->

                </div>
            </div>
        </div>

		
			
		
		
    </div>









